Samtidighetsmönster i JavaScript: Promise-pooler och hastighetsbegränsning

I modern JavaScript-utveckling är hantering av asynkrona operationer ett grundläggande krav. Oavsett om du hämtar data från API:er, bearbetar stora datamängder eller hanterar användarinteraktioner, är effektiv samtidighetsstyrning avgörande för prestanda och stabilitet. Två kraftfulla mönster som tar sig an denna utmaning är Promise-pooler och hastighetsbegränsning. Denna artikel dyker djupt ner i dessa koncept, ger praktiska exempel och visar hur du kan implementera dem i dina projekt.

Förståelse för asynkrona operationer och samtidighet

JavaScript är till sin natur entrådat. Detta innebär att endast en operation kan utföras åt gången. Men med införandet av asynkrona operationer (med tekniker som callbacks, Promises och async/await) kan JavaScript hantera flera uppgifter samtidigt utan att blockera huvudtråden. Samtidighet, i detta sammanhang, innebär att hantera flera pågående uppgifter simultant.

Tänk på dessa scenarier:

• Hämta data från flera API:er samtidigt för att fylla en instrumentpanel.
• Bearbeta ett stort antal bilder i en batch.
• Hantera flera användarförfrågningar som kräver databasinteraktioner.

Utan korrekt samtidighetsstyrning kan du stöta på prestandaflaskhalsar, ökad latens och till och med applikationsinstabilitet. Att bombardera ett API med för många förfrågningar kan till exempel leda till fel på grund av hastighetsbegränsning eller till och med driftstopp. På samma sätt kan körning av för många CPU-intensiva uppgifter samtidigt överbelasta klientens eller serverns resurser.

Promise-pooler: Hantering av samtidiga uppgifter

En Promise-pool är en mekanism för att begränsa antalet samtidiga asynkrona operationer. Den säkerställer att endast ett visst antal uppgifter körs vid varje given tidpunkt, vilket förhindrar resursutmattning och upprätthåller responsivitet. Detta mönster är särskilt användbart när man hanterar ett stort antal oberoende uppgifter som kan utföras parallellt men behöver strypas.

Implementera en Promise-pool

Här är en grundläggande implementering av en Promise-pool i JavaScript:

            
class PromisePool {
  constructor(concurrency) {
    this.concurrency = concurrency;
    this.running = 0;
    this.queue = [];
  }

  async add(task) {
    return new Promise((resolve, reject) => {
      this.queue.push({ task, resolve, reject });
      this.processQueue();
    });
  }

  async processQueue() {
    if (this.running < this.concurrency && this.queue.length) {
      const { task, resolve, reject } = this.queue.shift();
      this.running++;

      try {
        const result = await task();
        resolve(result);
      } catch (error) {
        reject(error);
      } finally {
        this.running--;
        this.processQueue(); // Process the next task in the queue
      }
    }
  }
}

            

              
                Copy
              
            
          

Förklaring:

• Klassen PromisePool tar en concurrency-parameter, som definierar det maximala antalet uppgifter som kan köras samtidigt.
• Metoden add lägger till en uppgift (en funktion som returnerar ett Promise) i kön. Den returnerar ett Promise som kommer att uppfyllas eller avvisas när uppgiften är klar.
• Metoden processQueue kontrollerar om det finns lediga platser (this.running < this.concurrency) och uppgifter i kön. Om så är fallet, tar den en uppgift från kön, exekverar den och uppdaterar running-räknaren.
• finally-blocket säkerställer att running-räknaren minskas och att processQueue-metoden anropas igen för att bearbeta nästa uppgift i kön, även om uppgiften misslyckas.

Exempelanvändning

Låt oss säga att du har en array med URL:er och du vill hämta data från varje URL med hjälp av fetch-API:et, men du vill begränsa antalet samtidiga förfrågningar för att undvika att överbelasta servern.

            
async function fetchData(url) {
  console.log(`Fetching data from ${url}`);
  // Simulate network latency
  await new Promise(resolve => setTimeout(resolve, Math.random() * 1000));
  const response = await fetch(url);
  if (!response.ok) {
    throw new Error(`HTTP error! status: ${response.status}`);
  }
  return await response.json();
}

async function main() {
  const urls = [
    'https://jsonplaceholder.typicode.com/todos/1',
    'https://jsonplaceholder.typicode.com/todos/2',
    'https://jsonplaceholder.typicode.com/todos/3',
    'https://jsonplaceholder.typicode.com/todos/4',
    'https://jsonplaceholder.typicode.com/todos/5',
    'https://jsonplaceholder.typicode.com/todos/6',
    'https://jsonplaceholder.typicode.com/todos/7',
    'https://jsonplaceholder.typicode.com/todos/8',
    'https://jsonplaceholder.typicode.com/todos/9',
    'https://jsonplaceholder.typicode.com/todos/10',
  ];

  const pool = new PromisePool(3); // Limit concurrency to 3
  const promises = urls.map(url => pool.add(() => fetchData(url)));

  try {
    const results = await Promise.all(promises);
    console.log('Results:', results);
  } catch (error) {
    console.error('Error fetching data:', error);
  }
}

main();

            

              
                Copy
              
            
          

I det här exemplet är PromisePool konfigurerad med en samtidighet på 3. Funktionen urls.map skapar en array av Promises, där var och en representerar en uppgift att hämta data från en specifik URL. Metoden pool.add lägger till varje uppgift i Promise-poolen, som hanterar exekveringen av dessa uppgifter samtidigt och säkerställer att högst 3 förfrågningar är pågående vid varje given tidpunkt. Funktionen Promise.all väntar på att alla uppgifter ska slutföras och returnerar en array med resultat.

Hastighetsbegränsning: Förhindra API-missbruk och överbelastning

Hastighetsbegränsning är en teknik för att kontrollera i vilken takt klienter (eller användare) kan göra förfrågningar till en tjänst eller ett API. Det är avgörande för att förhindra missbruk, skydda mot överbelastningsattacker (DoS) och säkerställa rättvis resursanvändning. Hastighetsbegränsning kan implementeras på klientsidan, serversidan eller båda.

Varför använda hastighetsbegränsning?

• Förhindra missbruk: Begränsar antalet förfrågningar som en enskild användare eller klient kan göra under en viss tidsperiod, vilket förhindrar dem från att överbelasta servern med överdrivna förfrågningar.
• Skydda mot DoS-attacker: Hjälper till att mildra effekten av distribuerade överbelastningsattacker (DDoS) genom att begränsa takten med vilken angripare kan skicka förfrågningar.
• Säkerställa rättvis användning: Tillåter olika användare eller klienter att komma åt resurser på ett rättvist sätt genom att fördela förfrågningar jämnt.
• Förbättra prestanda: Förhindrar att servern blir överbelastad, vilket säkerställer att den kan svara på förfrågningar i tid.
• Kostnadsoptimering: Minskar risken för att överskrida API-användningskvoter och dra på sig extra kostnader från tredjepartstjänster.

Implementera hastighetsbegränsning i JavaScript

Det finns olika tillvägagångssätt för att implementera hastighetsbegränsning i JavaScript, var och en med sina egna avvägningar. Här kommer vi att utforska en klientsidesimplementering med en enkel token bucket-algoritm.

            
class RateLimiter {
  constructor(capacity, refillRate, interval) {
    this.capacity = capacity; // Maximum number of tokens
    this.tokens = capacity;
    this.refillRate = refillRate; // Tokens added per interval
    this.interval = interval; // Interval in milliseconds

    setInterval(() => {
      this.refill();
    }, this.interval);
  }

  refill() {
    this.tokens = Math.min(this.capacity, this.tokens + this.refillRate);
  }

  async consume(cost = 1) {
    if (this.tokens >= cost) {
      this.tokens -= cost;
      return Promise.resolve();
    } else {
      return new Promise((resolve, reject) => {
        const waitTime = Math.ceil((cost - this.tokens) / this.refillRate) * this.interval;
        setTimeout(() => {
          if (this.tokens >= cost) {
            this.tokens -= cost;
            resolve();
          } else {
            reject(new Error('Rate limit exceeded.'));
          }
        }, waitTime);
      });
    }
  }
}

            

              
                Copy
              
            
          

Förklaring:

• Klassen RateLimiter tar tre parametrar: capacity (det maximala antalet tokens), refillRate (antalet tokens som läggs till per intervall) och interval (tidsintervallet i millisekunder).
• Metoden refill lägger till tokens i hinken med en hastighet av refillRate per interval, upp till den maximala kapaciteten.
• Metoden consume försöker konsumera ett specificerat antal tokens (standard är 1). Om det finns tillräckligt med tokens tillgängliga, konsumerar den dem och uppfylls omedelbart. Annars beräknar den hur lång tid man måste vänta tills tillräckligt med tokens finns tillgängliga, väntar den tiden och försöker sedan konsumera tokens igen. Om det fortfarande inte finns tillräckligt med tokens, avvisas den med ett fel.

Exempelanvändning

            
async function makeApiRequest() {
  // Simulate API request
  await new Promise(resolve => setTimeout(resolve, Math.random() * 500));
  console.log('API request successful');
}

async function main() {
  const rateLimiter = new RateLimiter(5, 1, 1000); // 5 requests per second

  for (let i = 0; i < 10; i++) {
    try {
      await rateLimiter.consume();
      await makeApiRequest();
    } catch (error) {
      console.error('Rate limit exceeded:', error.message);
    }
  }
}

main();

            

              
                Copy
              
            
          

I det här exemplet är RateLimiter konfigurerad för att tillåta 5 förfrågningar per sekund. Funktionen main gör 10 API-förfrågningar, var och en föregås av ett anrop till rateLimiter.consume(). Om hastighetsgränsen överskrids kommer consume-metoden att avvisas med ett fel, vilket fångas av try...catch-blocket.

Kombinera Promise-pooler och hastighetsbegränsning

I vissa scenarier kan du vilja kombinera Promise-pooler och hastighetsbegränsning för att uppnå mer detaljerad kontroll över samtidighet och förfrågningsfrekvens. Du kanske till exempel vill begränsa antalet samtidiga förfrågningar till en specifik API-slutpunkt samtidigt som du säkerställer att den totala förfrågningsfrekvensen inte överskrider en viss tröskel.

Så här kan du kombinera dessa två mönster:

            
async function fetchDataWithRateLimit(url, rateLimiter) {
  try {
    await rateLimiter.consume();
    return await fetchData(url);
  } catch (error) {
    throw error;
  }
}

async function main() {
  const urls = [
    'https://jsonplaceholder.typicode.com/todos/1',
    'https://jsonplaceholder.typicode.com/todos/2',
    'https://jsonplaceholder.typicode.com/todos/3',
    'https://jsonplaceholder.typicode.com/todos/4',
    'https://jsonplaceholder.typicode.com/todos/5',
    'https://jsonplaceholder.typicode.com/todos/6',
    'https://jsonplaceholder.typicode.com/todos/7',
    'https://jsonplaceholder.typicode.com/todos/8',
    'https://jsonplaceholder.typicode.com/todos/9',
    'https://jsonplaceholder.typicode.com/todos/10',
  ];

  const pool = new PromisePool(3); // Limit concurrency to 3
  const rateLimiter = new RateLimiter(5, 1, 1000); // 5 requests per second

  const promises = urls.map(url => pool.add(() => fetchDataWithRateLimit(url, rateLimiter)));

  try {
    const results = await Promise.all(promises);
    console.log('Results:', results);
  } catch (error) {
    console.error('Error fetching data:', error);
  }
}

main();

            

              
                Copy
              
            
          

I det här exemplet konsumerar funktionen fetchDataWithRateLimit först en token från RateLimiter innan den hämtar data från URL:en. Detta säkerställer att förfrågningsfrekvensen är begränsad, oavsett den samtidighetsnivå som hanteras av PromisePool.

Att tänka på för globala applikationer

När du implementerar Promise-pooler och hastighetsbegränsning i globala applikationer är det viktigt att ta hänsyn till följande faktorer:

• Tidszoner: Var medveten om tidszoner när du implementerar hastighetsbegränsning. Se till att din logik för hastighetsbegränsning baseras på en konsekvent tidszon eller använder en tidszonsagnostisk metod (t.ex. UTC).
• Geografisk distribution: Om din applikation distribueras över flera geografiska regioner, överväg att implementera hastighetsbegränsning per region för att ta hänsyn till skillnader i nätverkslatens och användarbeteende. Content Delivery Networks (CDN) erbjuder ofta funktioner för hastighetsbegränsning som kan konfigureras vid nätverkskanten.
• API-leverantörers hastighetsbegränsningar: Var medveten om de hastighetsbegränsningar som införs av tredjeparts-API:er som din applikation använder. Implementera din egen logik för hastighetsbegränsning för att hålla dig inom dessa gränser och undvika att bli blockerad. Överväg att använda exponentiell backoff med jitter för att hantera fel från hastighetsbegränsning på ett elegant sätt.
• Användarupplevelse: Ge informativa felmeddelanden till användare när de blir hastighetsbegränsade, förklara anledningen till begränsningen och hur de kan undvika den i framtiden. Överväg att erbjuda olika servicenivåer med varierande hastighetsbegränsningar för att tillgodose olika användarbehov.
• Övervakning och loggning: Övervaka din applikations samtidighet och förfrågningsfrekvens för att identifiera potentiella flaskhalsar och säkerställa att din logik för hastighetsbegränsning är effektiv. Logga relevanta mätvärden för att spåra användningsmönster och identifiera potentiellt missbruk.

Slutsats

Promise-pooler och hastighetsbegränsning är kraftfulla verktyg för att hantera samtidighet och förhindra överbelastning i JavaScript-applikationer. Genom att förstå dessa mönster och implementera dem effektivt kan du förbättra prestanda, stabilitet och skalbarhet i dina applikationer. Oavsett om du bygger en enkel webbapplikation eller ett komplext distribuerat system är det avgörande att bemästra dessa koncept för att bygga robust och pålitlig programvara.

Kom ihåg att noggrant överväga de specifika kraven för din applikation och välja lämplig strategi för samtidighetsstyrning. Experimentera med olika konfigurationer för att hitta den optimala balansen mellan prestanda och resursutnyttjande. Med en solid förståelse för Promise-pooler och hastighetsbegränsning kommer du att vara väl rustad för att ta dig an utmaningarna i modern JavaScript-utveckling.